import React from 'react';
import { Row, Col, InputNumber, Select, Button } from 'antd';
import { DATA_TYPE_NUMBER, DATA_TYPE_BOOLEAN } from '../../../../utils/constant';
import { compare } from '../../../../utils/compare';
import ConditionsIndex from '../../../../components/Conditions/ConditionsIndex';

const ENUMS = ['true', 'false'];

export default function ruleScoreCaseItem(props) {
  const { value = {} } = props;

  //  设置条件
  const handleConditionChange = (_value) => {
    value.conditions = _value
    props.onChange && props.onChange(value)
  }

  const handleBoolean = (_value) => {
    // console.log('选择', _value);
    value.value = _value;
    props.onChange && props.onChange(value);
  };

  const handleScore = (_value) => {
    value.score = _value;
    props.onChange && props.onChange(value);
  };

  return (
    <Row type='flex' justify='space-between' className='rule-item'>
      <Col span={4} style={{ paddingLeft: '10px' }}>
        {props.index + 1}
      </Col>
      <Col span={8}>
        {DATA_TYPE_NUMBER.includes(props.data_type) || props.data_type === null || props.data_type === undefined ? (
          <ConditionsIndex
            {...props}
            disabled={props.disabled}
            value={value.conditions}
            compareData={(props.compareData && props.compareData.conditions) || undefined}
            leftDisable={true}
            type='cross'
            onChange={(value) => handleConditionChange(value)}
          />
        ) : DATA_TYPE_BOOLEAN.includes(props.data_type) ? (
          <Select
            style={{ width: '80%', ...compare(props, 'value') }}
            value={value.value || ''}
            onChange={handleBoolean}
            disabled={props.disabled}
          >
            {ENUMS.map((item) => {
              return (
                <Select.Option
                  key={item}
                  value={item}
                  disabled={props.cases
                    .filter((it, index) => index !== props.index)
                    .map((it) => it.value)
                    .includes(item)}
                >
                  {item}
                </Select.Option>
              );
            })}
          </Select>
        ) : null}
      </Col>
      <Col span={8}>
        得
        <InputNumber
          value={value.score}
          onChange={handleScore || 1}
          style={{ margin: '0 10px', ...compare(props, 'score') }}
          disabled={props.disabled}
          max={99999}
          min={-99999}
          precision={4}
          step={1}
        />
        分
      </Col>
      {!props.disabled && !DATA_TYPE_BOOLEAN.includes(props.data_type) ? (
        <Col span={4}>
          <Button type='link' onClick={() => props.onDel && props.onDel()}>
            删除
          </Button>
          {props.index === props.len - 1 && (
            <Button type='link' onClick={() => props.onAdd && props.onAdd()}>
              添加
            </Button>
          )}
        </Col>
      ) : (
        <Col span={4} />
      )}
    </Row>
  );
}